<!DOCTYPE html>
<style>
    body { overflow:scroll; } /* A second layout pass might hide the bug. */
</style>
<p>There should be a blue, a cyan, and another blue square below, stacked vertically.</p>
<div id="multicol" style="columns:3; column-gap:0; column-fill:auto; width:60px; height:99px; line-height:20px; orphans:1; widows:1;">
    <br>
    <br>
    <br>
    <table cellspacing="0" cellpadding="0">
        <caption>
            <br><br>
        </caption>
        <tbody data-expected-height="60">
            <tr data-expected-height="60">
                <td data-expected-height="60"><br><br><br></td>
                <td data-expected-height="60" style="background:blue;">
                    <div data-offset-y="20" data-expected-height="20" style="width:20px; background:cyan;"><br></div>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<script src="../resources/check-layout.js"></script>
<script>
    checkLayout("#multicol");
</script>
